Andi Rest

Home » Blog Tutorial

Tampilkan postingan dengan label Blog Tutorial. Tampilkan semua postingan

Cara Membuat Halaman Perbaikan (Maintenance) di Blog

Cara Membuat Halaman Perbaikan (Maintenance) di Blog - Berikut ini adalah Cara Membuat Halaman Perbaikan (Maintenance) di Blog? Cara ini digunakan disaat blog dalam perbaikan, dan tentu pada saat utak-atik template blog akan terlihat berantakan dan berserakan. Kalau keadaan blog berantakan orang yang berkunjung pun juga bingung, jadi untuk antisipasinya cukup menggunakan sedikit kode CSS saja.

Cara Membuat Halaman Perbaikan (Maintenance) di Blog -

1. Login ke Blogger.
2. Template >> Edit HTML.
3. Cari kode ]]></b:skin>.
4. Letakkan kode dibawah ini tepat diatas kode ]]></b:skin>

html {
height: 100%;
background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhXmkztsWl_152zbFEchlkvgFaFnR7KR_o85pNm46wLNrJCo9EQtfUGkZpRqlOM2O53Xkc-WE5BeXM6S3fd2pdNW6GD6gQLNGD9TPHfmDjuLv76tdXfb-gKaKzSXNw4wrTo7wK9Rdgo5BA/s1600/perbaikan.jpg) no-repeat center 50%;
margin: 0;
}
body {
display: none;
}

5. Simpan dan selesai

Note - Ganti Tulisan yang berwarna dengan url gambar sobat.

- Semoga Bermanfaat -

Cara Membuat Pop Up Window di Blog

Cara Membuat Pop Up Window di Blog - Berikut ini adalah cara membuat Pop Up windows diblog. Pop Up window diblog yaitu halaman baru yang berisi sebuah web atau informasi baru pada saat web awal diakses. Pop Up biasa digunakan untuk ikaln dan lain-lain. Namun terkadang Pop Up sangat mengganggu pengunjung karena munculnya web baru tersebut. Berikut ini cara membuat nya -

1.Login
2.Pilih Template >> Edit HTML
3.Kemudian cari kode <body> (Ctrl+F untuk mempercepat pencarian).
4.Copy kode dibawah ini dan pastekan tepat dibawah kode <body>

<script type="text/javascript">
var popurls=new Array()
popurls[0]="Url Pop Up"
popurls[1]="Url Pop Up"
popurls[2]="Url Pop Up"
popurls[3]="Url Pop Up"
function openpopup(popurl){
var winpops=window.open(popurl,"","width=,height=,toolbar,location,status,
scrollbars,menubar,resizable")
}
openpopup(popurls[Math.floor(Math.random()*(popurls.length))])
</script>

5.Selanjutnya Simpan & selesai.

NB - Ganti Url Pop Up dengan url yang diinginkan.

----selamat mencoba & semoga bermanfaat----

Cara Memasang Burung Twitter Terbang di Blog

Cara Memasang Burung Twitter Terbang di Blog - Berikut ini adalah cara memasang burung twitter terbang diblog. Cara kerja burung ini yaitu terbang mondar mandir dan terkadang sedikit membuat emosi. Sobat tertarik ingin memasangnya? saya tidak.

Berikut ini cara memasang nya diblog -
1.Login
2.Tata Letak >> Tambah Gadget >> Pilih HTML/Javascript
3.Copy dan pastekan kode dibawah ini ke HTML/Javascript

<script type="text/javascript" src="http://tateluproject.googlecode.com/files/tripleflap.js"></script>
<script type="text/javascript">
var birdSprite="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiWm2UsxvSw179VmH7dbJeMYqof0simRrc3iIHylFCm2e-EtAEYkEG3n4wirSs3LTi3y4XKCXYyk-O9rGyZOIv6K51JsbohCv_P8U-YQGR0zonGK4cr2EvYjW46swHcTrM4_j5ZYsbxJ2A/s1600/burung+twitter+terbang.png";
var targetElems=new Array("img","hr","table","td","div","input","textarea","button","select","ul","ol","li","h1","h2","h3","h4","p","code","object","a","b","strong","span");
var twitterAccount = "http://twitter.com/AndiRest";
var tweetThisText = "Twitter - UserID http://bloggerpeer.blogspot.com/";
tripleflapInit();
</script>

4.Selanjutnya simpan dan lihat hasilnya.

NB - Ganti AndiRest, untuk icon burung twitter silah kan ganti https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiWm2UsxvSw179VmH7dbJeMYqof0simRrc3iIHylFCm2e-EtAEYkEG3n4wirSs3LTi3y4XKCXYyk-O9rGyZOIv6K51JsbohCv_P8U-YQGR0zonGK4cr2EvYjW46swHcTrM4_j5ZYsbxJ2A/s1600/burung+twitter+terbang.png dengan icon dibawah ini -

Warna Kuning

https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjOgIk7Xy9ajrX_xLfeBR-iKFtgiAi69Yl_zFi1DHossBtTGNCxgTucvVeDzP9Lwt1jfTognvOMSIotY8ZL2nh3SR5dZMoB9wmhac3uGwhyphenhyphendnzOzQKKkepU_lS2qVz1YhLODbzYB2ZBNYA/s1600/yellow+bird.png

Warna Hitam

https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj2JVQOeGwlak2gd3Rk1qnppqn_oYilli03NJUvElPznN_odsT5408AHC05RgYwUeuA3ZDHhXl3Gqr5lecNzSyN_xxgyyWbXTepY6OH_WmIjAOoUy1fnQhP1AbRzmDWhyphenhyphenckgmv5nmVmeR0/s1600/black+bird.png

Warna Biru

https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh33oMbLus61IeEnSNrwTC1t8bzNsPS6U2ObdL5rxC7YYo5FNj-qN5FETZ-wSiLPy-jIKF8iYde7s8RiQ-tC3XfQXh46zqLVLs7Q9JLHP2_Q9IEGOHD7PwLq4HNYzrpgtBI8vzKfRIxmKg/s1600/Blue+bird.png

Warna Coklat

https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgx_-jh1POdh9PuwaqHd9RZXOY5HKHbcA7T7swldFXq27D7SEE360RgtglVPEbbj7AGF73DIi9DbcS0uxxAqM_aHvGspQtK8pRR0gI1OzJpBYb8175eP6NfcV7HzRvc5Ht14OdhyphenhyphenGxJp9U/s1600/brown+bird.png

Warna Hijau

https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgB77a8aQuEOQd1aeA75dY-rJkrKi3UPU9i8tGwnOq4WYZnKBVZ8Aw8AQOCwcGEf9DC6nR2ZoQcRerwzSSbvDsWOC2V4kS6iWsh18r4PcxT9ApTIOrYchdo5hoximbCvtVD8Pbd3RaQvzQ/s1600/Green+bird.png

Warna Ungu

https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhTrkGDo-XW_VKjAujAI9gUy6pXMNZpAEHnJk2rF0H2ySN2XBsCilHKGH28uweqBzmbw0W6bUUjdXkanTNlZLY7hGGAJJ56zuzHNQ4avuOMZmdIQGo8ITlguTgL0tMdI3C1yQjEBT_kNUg/s1600/purple+bird.png

Warna Putih

https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi5p2nKCqAMUupILhUzpl-TTTrfXPZzvGyV4Gp-Dc_9A81AFd2DaQ7YCUi13khHz2fJ0hhwll010XjjYJl5WuHr6eTBnpdHQfquqErD5XlccHCnNqzhMZx7cC-iAD_9ctxm9K9JTOWPJ4s/s1600/white+bird.png

Warna Merah

https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhxIw-QWMj4Hs5Rk_4dA3Ec-uXFhqFlui0ELB_LTpwi2WY7GeaDUwoZIF0raM_MmFqXu49fv6KNW_RyKpQXPpaGDfcgmb-2cXNQTLl3ig1z0JvFh-P2kB2FAhqb_Aalod-Zi2k_F1v5lh0/s1600/red+bird.png

----selamat mencoba dan semoga bermanfaat----
(Sumber - Cara Membuat / Memasang Burung Twitter Terbang di Blog)

Cara Membuat Daftar Isi Otomatis Untuk Label Tertentu di Blog

Cara Membuat Daftar Isi Otomatis Untuk Label Tertentu di Blog - Berikut ini adalah cara membuat Daftar isi dengan label tertentu di blogger. Seperti halnya juga membuat Daftar isi yang mana seluruh isi perlabel terlihat namun yang ini hanya menampilkan satu label saja. Untuk lebih jelasnya langsung saja klik Demo di bawah ini -

Berikut ini cara membuatnya -

1.Login ke blogger
2.langsung menuju Tata letak >> Tambah Gadget >> HTML/Javascript
3.Kemudian copy dan pastekan code dibawah ini ke kotak HTML/Javascript

<div style="overflow:auto; width:auto; height:150px; padding:5px;border:0px solid #000000; font-family:julee; font-size:15px; font-color:#0000FF;">
<ol>
<script style="text/javascript">
var numposts = 100;
var standardstyling = true;
</script>
<script type='text/javascript' src='http://tateluproject.googlecode.com/files/postlabel%281%29.js'></script><ol>
<script src="http://www.andisitorus.com/feeds/posts/default/-/Blog%20Tutorial?orderby=published&alt=json-in-script&callback=showrecentposts&max-results=999"></script>
</ol>
</ol></div>

4.Kemudian simpan.

NB - Ganti http://www.andisitorus.com dengan URL blog Sobat, Blog%20Tutorial ganti sesuai dengan label sobat - %20 adalah tanda spasi jadi perhatikan setiap penulisan, height:150px - tinggi dari scroll box, sobat juga bisa meletakkan code diatas pada postingan.

Jika sobat ingin menggunakan tanpa menggunakan scroll box berikut ini codenya -

<script style="text/javascript">
var numposts = 100;
var standardstyling = true;
</script>
<script type='text/javascript' src='http://tateluproject.googlecode.com/files/postlabel%281%29.js'></script><ol>
<script src="http://www.andisitorus.com/feeds/posts/default/-/Blog%20Tutorial?orderby=published&alt=json-in-script&callback=showrecentposts&max-results=999"></script></ol>

----selamat mencoba & semoga bermanfaat----

Cara Menghilangkan Navbar Terbaru di Blog

Cara Menghilangkan Navbar Terbaru di Blog - Berikut ini adalah cara menghilang kan navbar terbaru cara nya pun sangat mudah , cara ini juga legal dari blogger sendiri, dan sangat bebeda dari yang dulu-dulu yang penuh dengan kontroversial.

Berikut ini cara nya -

1.Login ke blogger
2.Langsung menuju tata letak

3.pilih/klik Edit pada widget Navbar

4.Setelah muncul tampilannya, pilih Off

5.Kemudian klik simpan & selesai

----selamat mencoba dan semoga bermanfaat----

Membuat Widget Tulisan Mengetik Sendiri di Blog

Membuat Widget Tulisan Mengetik Sendiri di Blog - Berikut ini adalah cara membuat Tulisan mengetik sendiri? Apa maksudnya?
Lebih jelas lihat contoh dibawah ini -

Seperti itulah Tulisan mengetik sendiri, Berikut ini scriptnya -

<br />
<form name="news"><br />
<textarea cols="50" name="news2" rows="3" wrap="virtual"></textarea></form><br />
<script type="text/javascript"><br />
//<![CDATA[<br />
var newsText = new Array();<br />
newsText[0] = "<span style="color: #cc0000;">Tips dan Trik Blogger</span> ";<br />
newsText[1] = "<span style="color: #cc0000;">Membuat Widget Tulisan Mengetik Sendiri di Blog</span>";<br />
newsText[2] = "<span style="color: #cc0000;">selamat mencoba</span>";<br />
newsText[3] = "<span style="color: #cc0000;">dan semoga bermanfaat</span>";<br />
newsText[4] = "<span style="color: #cc0000;">andisitorus.com</span>";<br />
newsText[5] = "<span style="color: #cc0000;">Salam</span> ";<br />
var ttloop = 1; // diulang-ulang teksnya ganti dengan 1 (1 = True; 0 = False)<br />
var tspeed = 250; // Typing speed in milliseconds (larger number = slower)<br />
var tdelay = 1000; // Time delay between newsTexts in milliseconds<br />
// ------------- NO EDITING AFTER THIS LINE -------------<br />
var dwAText, cnews=0, eline=0, cchar=0, mxText;<br />
function doNews() {<br />
mxText = newsText.length - 1;<br />
dwAText = newsText[cnews];<br />
setTimeout("addChar()",1000)<br />
}<br />
function addNews() {<br />
cnews += 1;<br />
if (cnews <= mxText) {<br />
dwAText = newsText[cnews];<br />
if (dwAText.length != 0) {<br />
document.news.news2.value = "";<br />
eline = 0;<br />
setTimeout("addChar()",tspeed)<br />
}<br />
}<br />
}<br />
function addChar() {<br />
if (eline!=1) {<br />
if (cchar != dwAText.length) {<br />
nmttxt = ""; for (var k=0; k<=cchar;k++) nmttxt += dwAText.charAt(k);<br />
document.news.news2.value = nmttxt;<br />
cchar += 1;<br />
if (cchar != dwAText.length) document.news.news2.value += "_";<br />
} else {<br />
cchar = 0;<br />
eline = 1;<br />
}<br />
if (mxText==cnews && eline!=0 && ttloop!=0) {<br />
cnews = 0; setTimeout("addNews()",tdelay);<br />
} else setTimeout("addChar()",tspeed);<br />
} else {<br />
setTimeout("addNews()",tdelay)<br />
}<br />
}<br />
doNews()<br />
//]]><br />
</script>

Nb - Ganti tulisan yang berwarna sesuai keinginan, script ini dapat diletakkan pada Widget atau postingan.

----selamat mencoba & semoga bermanfaat----

Cara Membuat Komentar Facebook Berdampingan Dengan Komentar Blogger

Cara Membuat Komentar Facebook Berdampingan Dengan Komentar Blogger - Berikut ini adalah cara membuat komentar facebook berdampingan dengan komentar blog, fungsinya dalah untuk memudahkan pengunjung blog jika ingin berkomentar apakah ingin menggunakan komentar blog atau facebook. Berikut ini caranya -

1.Login
2.Template >> Edit HTML
3.Centang kotak Expand Widget Template
4.Kemudian cari kode ]]></b:skin> (CTRL+F pencarian cepat)
5.Selanjutnya Copy dan pastekan kode dibawah ini tepat diatas ]]></b:skin>

.comments-page { background-color: #f2f2f2;}#blogger-comments-page { padding: 0px 5px; display: none;}.comments-tab { float: left; padding: 5px; margin-right: 3px;cursor: pointer; background-color: #f2f2f2;}.comments-tab-icon { height: 14px; width: auto; margin-right: 3px;}.comments-tab:hover { background-color: #eeeeee;}.inactive-select-tab { background-color: #d1d1d1;}

6.Lanjut lagi, kemudian cari kode </head>
7.Copy dan pastekan kode dibawah ini tepat diatas kode </head>

<script src='http://connect.facebook.net/en_US/all.js#xfbml=1'/>
<script src='http://code.jquery.com/jquery-latest.js'/>
<meta content='ID Fb sobat' property='fb:admins'/>
<script type='text/javascript'>
function commentToggle(selectTab) {
$(".comments-tab").addClass("inactive-select-tab");
$(selectTab).removeClass("inactive-select-tab");
$(".comments-page").hide();
$(selectTab + "-page").show();}
</script>

8.Ganti ID Fb sobat (tulisan berwarna diatas)
9.Lanjut lagi, cari kode <div class='comments' id='comments'>
10.Kode tersebut terdapat 2 & letakkan kode dibawah ini tepat dibawah 2 kode tersebut

<div class='comments-tab' id='fb-comments' onclick='javascript:commentToggle("#fb-comments");' title='Comments made with Facebook'><img class='comments-tab-icon' src='http://static.ak.fbcdn.net/rsrc.php/v1/yH/r/eIpbnVKI9lR.png'/><fb:comments-count expr:href='data:post.url'/> Comments</div><div class='comments-tab inactive-select-tab' id='blogger-comments' onclick='javascript:commentToggle("#blogger-comments");' title='Comments from Blogger'><img class='comments-tab-icon' src='http://www.blogger.com/img/icon_logo32.gif'/> <data:post.numComments/> Comments</div><div class='clear'/></div><div class='comments-page' id='fb-comments-page'><b:if cond='data:blog.pageType == "item"'><div id='fb-root'/><fb:comments expr:href='data:post.url' num_posts='2' width='450'/></b:if></div><div class='comments comments-page' id='blogger-comments-page'>

11.Ganti 450 , sesuikan dengan lebar blog sobat (450=lebar kotak komentar facebook)

----selamat mencoba & semoga bermanfaat----

Cara Menghapus Tulisan Tampilkan Posting Dengan Label di Blog

cara menghapus tulisan tampilkan posting dengan label di Blog - Berikut ini adalah cara menghilangkan pesan Tampilkan Semua Posting Pada Label, Apa itu? Apa bila Label dibuka maka pada bagian atas akan muncul pesan tersebut, nah mungkin ada yang sedikit resah atau ingin sekali menghilangkan pesan tersebut berikut ini caranya -

1.Login
2.Template >> Edit HTML
3.Centang kotak Expand Widget Template
4.Cari kode seperti dibawah ini

<b:includable id='status-message'> <b:if cond='data:navMessage'> <div class='status-msg-wrap'> <div class='status-msg-body'> <data:navMessage/> </div> <div class='status-msg-border'> <div class='status-msg-bg'> <div class='status-msg-hidden'><data:navMessage/></div> </div> </div> </div> <div style='clear: both;'/> </b:if> </b:includable>

5.Ganti kode yang diatas tadi dengan kode dibawah ini

<b:includable id='status-message'>
<b:if cond='data:navMessage'>
<div>
</div>
<div style='clear: both;'/>
</b:if>
</b:includable>

6.Jika sudah merasa benar langsung disave dan lihat hasilnya

----selamat mencoba & semoga bermanfaat----

Cara Membuat Efek Zoom pada Gambar di Blog

Cara Membuat Efek Zoom pada Gambar di Blog - Efek Zoom pada gambar diblog adalah ketika kursor mengarah ke gambar maka gambar tersebut akan membesar, jika blog yang banyak menggunakan gambar cara ini sangat cocok untuk digunakan misalkan blog yang bertemakan Gallery foto.
Berikut ini langkah-langkah membuatnya -

1.Login
2.Selanjutnya langsung menuju >> Template >> Edit HTML

3.Kemudian cari kode ]]></b:skin> (CTRL + F untuk pencarian lebih cepat)
4.Copy dan pastekan kode dibawah ini tepat diatas kode ]]></b:skin>

.post img:hover {
-o-transition: all 0.3s;
-moz-transition: all 0.3s;
-webkit-transition: all 0.3s;
-moz-transform: scale(1.3);
-o-transform: scale(1.3);
-webkit-transform: scale(1.3); }

5.Save template dan lihat hasilnya.

Selamat mencoba & semoga bermanfaat.

Cara Membuat Random Post di Blog

Cara Membuat Random Post di Blog - Random post adalah menampilkan post secara acak dan postingan yang lama atau jarang terbaca akan tampil pada random post. Tertarik ingin membuatnya?
Berikut ini cara membuat Random Post -

1.Login.
2.Tata letak > tambah gadget > HTML/Javascript.
3.Copy dan pastekan kode dibawah ini ke HTML/Javascript.

<script type="text/javascript">
var randarray = new Array();var l=0;var flag;
var numofpost=8;function randomposts(json){
var total = parseInt(json.feed.openSearch$totalResults.$t,10);
for(i=0;i < numofpost;){flag=0;randarray.length=numofpost;l=Math.floor(Math.random()*total);for(j in randarray){if(l==randarray[j]){ flag=1;}}
if(flag==0&&l!=0){randarray[i++]=l;}}document.write('<ul>');
for(n in randarray){ var p=randarray[n];var entry=json.feed.entry[p-1];
for(k=0; k < entry.link.length; k++){if(entry.link[k].rel=='alternate'){var item = "<li>" + "<a href=" + entry.link[k].href + ">" + entry.title.$t + "</a> </li>";
document.write(item);}}
}document.write('</ul>');}
</script>
<script src="/feeds/posts/default?alt=json-in-script&start-index=1&max-results=1000&callback=randomposts" type="text/javascript"></script>

4.Save & lihat hasilnya.

Nb - var numofpost=8 adalah jumlah post ganti sesuai keinginan.
Selamat mencoba & semoga bermanfaat.

Cara Menghilangkan Angka Pada Label di Blog

Cara Menghilangkan Angka Pada Label di Blog - Angka pada label adalah menampilkan jumlah postingan yang ada pada setiap label yang dibuat. Angka yang banyak pada label akan menjadi patokan bagi visitor untuk melihatnya namun jika angkanya sedikit?
Berikut ini cara menghilangkan angka pada label tersebut -

1.Login.
2.Template > Edit HTML > Expand Templates Widget.
3.Cari kode > <span dir='ltr'>(<data:label.count/>)</span> , (CTRl+f pencarian lebih cepat)
4.Kemudian hapus kode tersebut.

5.Seleasi dan lihat hasilnya.

Selamat mencoba & semoga bermanfaat.

Cara Memasang Widget Jumlah Post di Blog

Cara Memasang Widget Jumlah Post di Blog - Fungsi dari widget ini untuk menghitung atau mengetahui jumlah postingan yang ada pada blog sobat. Langsung saja caranya -

1.Login yang paling utama
2.Langsung menuju Tata Telak >> Tambah Gadget >> HTML/Javasript
3.Kemudian copy dan paste kode dibawah ini -

<script style="text/javascript">function showpostcount(json) {document.write('Total Posts : <b>' + parseInt(json.feed.openSearch$totalResults.$t,10) + '</b><br>');}</script><script src="http://www.andisitorus.com/feeds/posts/default?alt=json-in-script&callback=showpostcount"></script>

4.Save & Selesai. Lihat hasilnya.

Nb - Ganti http://www.andisitorus.com dengan URL blog sobat.
----selamat mencoba----

Cara Mengganti Kursor Di Blog

Cara Mengganti Kursor Di Blog - Berikut cara mengganti kursor diblog untuk mempercantik blog karena kursor akan tampil berbeda.
Berikut ini langkah-langkah membuatnya -

1.Login
2.Tata letak >> Tambah Gadget >> HTML/Javascript
3.Copy dan pastekan kode dibawah ini pada HTML/Javascript .

<style type="text/css">
body {
cursor:url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgja90jeHM54uM2kZ61CwpAPm1ALoIlKn32MF6wDfMh5NE7BOVYT9LbSaFJKyvFJSrqq0uHRGzuUxKb2s0xXerx-UMKoFTlfWkowgkb4Aeby8HyMg2zp_HkINXp8_EEYkd6FUh9hZjvo7c/h120/4.gif")
,default}
</style>

Menghasilkan Kursor seperti ini -
Kursor

4.Simpan. Lihat hasilnya.

Berikut ini ada beberapa kursor yang bisa sobat pilih (ganti tulisan yang berwarna diatas) -

Kursor

http://i771.photobucket.com/albums/xx357/cebol_01/Kursor.png

Kursor

http://i34.photobucket.com/albums/d132/JuL14_ok/pinkbutterflies.gif

Kursor

http://i40.photobucket.com/albums/e230/dh34sy/flame.gif

Kursor

http://i425.photobucket.com/albums/pp332/hippmibjkt/sym455.jpg

Kursor

http://i872.photobucket.com/albums/ab288/bebe_munya/kursor1.gif

Kursor

https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjT6uDjPFyMH7EnoQC3s6B5EHhpFdY0CItWit7MteKZ3cid4Qyi1O8xQ31s27jkmfUvMpj5-uIkEy6yrA_Y_3Hv_PhMuvx8tdgBHEdN11hXy9Snlr1lAxA3ZYAb4FYJmZgrRsuqaIVJ7mc/h120/2.gif

Cara Membuat Efek Salju di Blog

Cara Membuat Efek Salju di Blog - Cara ini salah satu untuk mempercantik blog karena ada nya efek salju pada blog. Berikut ini cara membuatnya -

1.Login
2.Pilih Tata letak >> Add gadget >> HTML/JavaScript
3.Copy code script dibawah dan paste di kotak HTML/JavaScript, untuk judulnya kosongkan saja.

<script src="http://yourjavascript.com/102192216212/salju.js.txt.js"></script>

4.save, selesai dan lihat hasilnya.
----selamat mencoba----

Cara Membuat Tombol Reply pada Komentar Blog

Cara Membuat Tombol Reply pada Komentar Blog - Berikut ini saya akan berbagi tentang membuat Tombol Reply pada Komentar Blog, Tombol Reply sangat berfungsi untuk mempermudah membalas komentar pada blog kita.
Berikut ini caranya -

1.Login
2.Template >> Edit Html >> centang expand template widget
3.Cari kode <data:commentPostedByMsg/> (Ctrl+F untuk pencarian cepat)
4.Copy dan pastekan kode dibawah ini tepat dibawah kode <data:commentPostedByMsg/>

<b:if cond='data:blog.pageType != "static_page"'> <a expr:href='"https://www.blogger.com/comment.g?blogID=5640555051968018394&postID=" + data:post.id + "&isPopup=true&postBody=%40%3C%61%20%68%72%65%66%3D%22%23" + data:comment.anchorName + "%22%3E" + data:comment.author + "%3C%2F%61%3E%3A%20#form"' onClick='javascript:window.open (this.href,"bloggerPopup","toolbar=0,location=
0,statusbar=1,menubar=0,scrollbars=yes,width=450,height=450,");return false;' style='padding:0px 5px; border:1px solid #ddd;'>Reply Comment</a>
</b:if>

5.Save template.

Nb - Ganti 5640555051968018394 dengan ID blog sobat.

Terima kasih. ----selamat mencoba----

Cara Membuat Efek Hujan Uang di Blog

Cara Membuat Efek Hujan Uang di Blog - Efek hujan uang di blog sangat menarik untuk mempercantik blog akan tetapi cara ini sedikit mengganggu para pengunjung untuk membaca postingan blog dikarenakan banyak nya uang yang berjatuhan. Tapi kalu sobat tertarik ingin membuat nya berikut ini caranya -

1.Login
2.Tata letak >> Add Gadget >> HTML/Javascript

3.Kemudian copy paste kode dibawah ini

<script src='http://yourjavascript.com/734115111226/hujanuang.js.txt.js'/></script>

4.Save, selesai dan lihat hasilnya. ----selamat mencoba----

Cara Memasang Scroll Box di Komentar Blog

Cara Memasang Scroll Box di Komentar Blog - Fungsi scroll box jika komentar pada blog banyak maka komentar tersebut tidak memanjang kebawah, jika ingin melihat komentar cukup menggeser scroll box nya. Berikut ini cara memasangnya -

1.Login
2.Design > Edit HTML > Centang expand widget templates.
3.Kemudian cari kode seperti ini #comments-block{
4.Setelah itu akan dijumpai kode yang seperti dibawah ini

#comments-block{border:0px dotted #ccc;width:569px;margin:1.3em 0 1.5em;line-height:1.6em}

5.Dan selanjutnya ganti tulisan yang berwarna dengan kode di bawah ini

max-height:300px;border:1px solid #eee;overflow:auto;

6.Save template dan selesai.

Nb - Ganti angka 300 sesuai keinginan. ----selamat mencoba----

Cara Membuat Related Post dengan Gambar / Thumbnail

Cara Membuat Related Post dengan Gambar / Thumbnail - Berikut ini cara membuat related post dengan gambar yang terletak dibawah postingan blog.
Fungsi related post ini untuk menyajikan artikel lain kepada pengunjung blog. Berikut ini cara membuatnya -

1.Login
2.Design > Edit HTML > Centang expand widget templates.
3.Cari kode </head> (Ctrl+F untuk mempermudah pencarian) kemudian paste kode di bawah ini tepat di atas kode </head>

<b:if cond='data:blog.pageType == "item"'>
<style type='text/css'>
#related-posts {
float:center;
text-transform:none;
height:100%;
min-height:100%;
padding-top:5px;
padding-left:5px;
}

#related-posts h2{
font-size: 1.2em;
font-weight: bold;
margin-top: 0em;
padding-top: 0em;
}
#related-posts a{
color:black;
}
#related-posts a:hover{
color:black;
}

#related-posts a:hover {
background-color:#d4eaf2;
}
.post-body img {border:none;}
</style>
<script type='text/javascript'>
var defaultnoimage="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhthWE3UIlFEG2j2ZrzXvSGGtg37qbUcsRSVmCCfGcKLGGrmUvOqna8GOrgAdP0YM0ELERM0FW4uW3yycDJVbWs7-jvemtvT1TcgamUyjPw-iHBmD1qRG8-r5INTlwLJ2emnQdVJd4v8rw/s400/noimage.png";
var maxresults=6;
var splittercolor="#d4eaf2";
var relatedpoststitle="Software Terkait Yang Mungkin Anda Cari";
</script>
<script src='http://bloggergadgets.googlecode.com/files/related_posts_with_thumbnails_min.js' type='text/javascript'/>
</b:if>

4.Lanjut lagi, cari kode seperti dibawah ini

<div class='post-footer-line post-footer-line-1'> atau <p class='post-footer-line post-footer-line-1'>

5.Kalau sudah ketemu, sekarang paste kode berikut di bawah kode tadi.

<b:if cond='data:blog.pageType == "item"'>
<div id='related-posts'>
<b:loop values='data:post.labels' var='label'>
<b:if cond='data:label.isLast != "true"'>
</b:if>
<script expr:src='"/feeds/posts/default/-/" + data:label.name + "?alt=json-in-script&callback=related_results_labels_thumbs&max-results=6"' type='text/javascript'/></b:loop>
<script type='text/javascript'>
removeRelatedDuplicates_thumbs();
printRelatedLabels_thumbs("<data:post.url/>");
</script>
</div><div style='clear:both'/>
</b:if>

6.Save template dan selesai.

Cara Membuat Otomatis Refresh Di Blog

Cara Membuat Otomatis Refresh Di Blog - Fungsi Refresh pada blog ini adalah menyegarkan halaman pada blog. Pada umumnya Refresh menggunakan F5 atau cara lainnya namun kali ini dibuat secara otomatis. Berikut ini cara membuatnya -

1.Login
2.Masuk ke Rancangan >> Edit HTML
3.Cari kode </head> (Ctrl+F lebih cepat pencarian)
4.Letakkan kode berikut ini setelah kode </head>

<meta content=’200‘ http-equiv=’refresh’/>

5.Simpan template

Nb - Ganti angka 200 sesuai keinginan, angka 200 menunjukkan rentang waktu 200 detik.
----selamat mencoba----

Cara Buat Tombol Back To Top di Blogspot

Cara Buat Tombol Back To Top di Blogspot - Tombol Back To Top adalah sebuah tombol yang berguna untuk mempercepat scrolling dari bawah keatas di sebuah blog page.
Back To Top yang akan dibuat disini menggunakan Efek jQuery ini sedikit lebih lembut. Lansung saja untuk membuatnya -

1. Langkah pertama Sudah pasti Login
2. Pilih Template >> Edit HTML >> klik Expand Widget Template
3. Cari kode </body> (lebih cepat pencarian gunakan CTRL+F)
4. Copy kode dibawah ini dan Paste tepat diatas kode </body> (jika kode dibawah sudah ada pada template , kode dibawah tidak perlu dipasang)

<script src='http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js' type='text/javascript'/>

5. Kemudian Copy lagi kode dibawah ini dan Paste tepat dibawah kode diatas.

<script src='http://yourjavascript.com/387011122541/backtotop.js' type='text/javascript'/>

<a href='#' style='display:scroll;position:fixed;bottom:5px;right:5px;' title='Back to Top'><img onclick='MGJS.goTop();return false;' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiV_lJzX93LOUfq7ljiwkmzORnL8i_YXTJVKVEi19c8ucHu31ULYt5jMB10-EqXDjGZ54nXjdju7KBvfbNjW08ihvPMDvc5XCddDVaRed3BB-FJ5uXhGDD3q1Eqg749oYAhh7ItQp_A8Q4/s1600/back-to-top.gif'/></a>

Selesai. ----selamat mencoba----